import React from 'react'
import { withRouter } from 'react-router-dom'
import PropTypes from 'prop-types'
import './index.sass'
function SearchHeader({ history, cityName ,isShowBack,isGreen}) {
  // 添加属性校验
  SearchHeader.propTypes = {
    cityName: PropTypes.string.isRequired,
    isShowBack:PropTypes.bool,
    isGreen:PropTypes.bool
  }
  SearchHeader.defaultProps={
    isShowBack:true,
    isGreen:false
  }
  return (
   <div className="searchHeader">
     {
       isShowBack?
       <div className="iconfont icon-back back icon" 
        onClick={()=>history.go(-1)}></div>:
       <div className="icon"></div>
     }
     
     <div className="main">
       <div className="area" onClick={()=>history.push('/citylist')}>
         {cityName}<span className="iconfont icon-arrow"></span>
       </div>
       <div className="search_box">
         <span className="iconfont icon-seach"></span>
         <p>请输入小区或地址</p>
       </div>
     </div>
     <div className="iconfont icon-map map-icon icon" onClick={()=>history.push('/map')}
      style={{color:isGreen?'#00ae66':'#fff'}}>

      </div>
   </div>
  )
}
export default withRouter(SearchHeader)

